<template>
<div class="loading_cp">
    <div class="container my_box_shadow"
        :style="{
            transform:loading?'':'translateY(-50px)',
            opacity: loading?'1':'0',
        }">
        <i class="el-icon-loading"></i>
    </div>
</div>
</template>

<script>
//公共的加载动画组件
export default {
    name: 'LoadingCp',
    props:{
        loading:{
            type:Boolean,
            default:false,
        },
    },
}
</script>
<style lang="scss" scoped>
.loading_cp{
    width:100%;
    height:fit-content;
    position: fixed;
    top: 0px;
    left: 0px;
    z-index:999;
    pointer-events: none;
    .container{
        width: 50px;
        height: 50px;
        margin: 0 auto;
        background-color: #ffffff;
        border-radius: 0 0 50% 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        border: 1px solid #e3e8eb;
        border-top: none;
        transition: all 0.2s;
        i{
            font-size: 2rem;
        }
    }
}
</style>

